<!DOCTYPE html>
<!--suppress ThymeleafVariablesResolveInspection-->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" th:href="@{/layui/css/layui.css}" media="all" />
    <link th:href="@{/assets/plugins/bootstrap/css/bootstrap.min.css}" rel="stylesheet">
    <link th:href="@{/assets/plugins/font-awesome/css/font-awesome.min.css}" rel="stylesheet">
    <link th:href="@{/assets/css/custom.css}" rel="stylesheet">
    <script th:src="@{/assets/plugins/jquery/jquery-3.1.0.min.js}"></script>
    <script th:src="@{/layui/layui.js}"></script>
</head>
<style>
    ::-webkit-scrollbar {display:none}/*隐藏横向滚动条但可以滚动*/
    .layui-table-page {
        text-align: center;
    }

    .utable .layui-laypage .layui-laypage-curr .layui-laypage-em {
        background-color: #1E9FFF;
    }
    .layui-table-view thead th {
        text-align: center;
        font-weight: bold;
    }
    .layui-table-view tbody td {
        text-align: center;
    }
</style>
<script id="toolbarDemo" type="text/html">
    <div class="layui-btn-container">
        <a lay-event="fh" onclick="javascript:history.back(-1);" style="text-decoration:none">
            <i class="layui-icon"style="font-size: 20px">&#xe65c;</i>
        </a>
    </div>
</script>
<!--数据表格样式及附件-->
<script type="text/html" id="bar">
    <a style="text-decoration: none" class="layui-btn layui-btn-normal layui-btn-xs" lay-event="search">
        <i class="layui-icon">&#xe615;</i>查看周报
    </a>
</script>
<div class="utable">
    <table class="layui-table" id="demo" lay-filter="demo"></table>
</div>
<body>

<script type="text/javascript" th:inline="none">
    layui.use('table', function () {
        var table = layui.table;

        //方法渲染
        table.render({
            elem: '#demo',
            id: 'tab',
            width:1270,
            height:500,
            url: '/workdiary/myworkcheck',
            page: true,
            toolbar: '#toolbarDemo',
            cols:[[
                {field: 'worklogid', title: '编号', width:80}
                ,{field: 'emp_Name', title: '用户名'}
                ,{field: 'Workday', title: '发布时间'}
                ,{field: 'checkstate', title: '审核状态', templet: aaa}
                ,{field: 'checktime', title: '审核时间'}
                ,{field: 'checkperson', title: '审核人'}
                ,{fixed: 'right', title: '操作', toolbar: '#bar',width: 250}

            ]]
        });

        function search(id) {
            layer.open({
                type: 2,
                title: '查看周报',
                maxmin: true, //开启最大化最小化按钮
                area: ['700px', '600px'],
                content: '/workdiary/searchwork?worklogid='+id//这是链接你的页面地址 url
            })
        }

        //监听行工具事件
        table.on('tool(demo)', function (obj) {
            var data = obj.data;
            var id = data.worklogid;
            if (obj.event === 'search') {
                search(id);
            }
        });

        //审批状态
        function aaa(data){
            var status = data.checkstate;
            var btns = "";
            if (status == 1) {
                btns += '<span style="color:rgb(255,184,0)">待审核</span>';
            }
            if (status == 2) {
                btns += '<span style="color:green">已通过</span>';
            }
            if (status == 3) {
                btns += '<span style="color:red">未通过</span>';
            }
            return btns;
        }
    })
</script>
</body>
</html>